<html>
<head>
  <title>Evernote Export</title>
  <basefont face="微软雅黑" size="2" />
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
  <meta name="exporter-version" content="Evernote Windows/307027 (zh-CN, DDL); Windows/10.0.0 (Win64);"/>
  <meta name="reminder-order" content="2017/5/18 19:50"/>
  <style>
    body, td {
      font-family: 微软雅黑;
      font-size: 10pt;
    }
  </style>
</head>
<body>
<a name="2362"/>

<div>
<span><div><h3 style="margin: 10px 0px; padding: 5px 0px 5px 15px; background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">我们在哪里上网？</span></h3><div><br/></div><div><span style="background-color: rgb(255, 250, 165);-evernote-highlight:true;"><span style="background-color: rgb(255, 250, 165);font-size: 16pt;-evernote-highlight:true;"><img src="001-HTML入门及常见标签_files/Image.png" type="image/png" data-filename="Image.png" width="501"/></span></span></div><div><br/></div><h3 style="margin: 10px 0px; padding: 5px 0px 5px 15px; background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">网页有啥共同点</span></h3><div><span style="font-size: 16pt;"><img src="001-HTML入门及常见标签_files/Image [1].png" type="image/png" data-filename="Image.png" width="797"/></span></div><h3 style="margin: 10px 0px; padding: 5px 0px 5px 15px; background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">浏览器历史上的战绩</span></h3><div><br/></div><div><br/></div><div><span style="font-size: 16pt;"><img src="001-HTML入门及常见标签_files/IMG_5365.JPG" type="image/jpeg" data-filename="IMG_5365.JPG" style="font-weight: bold;"/></span></div><div><br/></div><h3><span style="font-size: 16pt; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">浏览器目前的市场份额</span></h3><div><br/></div><div><img src="001-HTML入门及常见标签_files/Image [2].png" type="image/png" data-filename="Image.png" style="font-size: 16pt;" width="739"/></div><div><br/></div><h3><span style="font-size: 16pt; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">浏览器为什么都差不多？？  谁给他们制定了共同的标准</span></h3><div><br/></div><div><br/></div><div><img src="001-HTML入门及常见标签_files/Image [3].png" type="image/png" data-filename="Image.png" width="803"/></div><div><br/></div><h3><span style="font-size: 16pt; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">目前最不喜欢遵守标准的是谁？</span></h3><div><br/></div><div><br/></div><div><img src="001-HTML入门及常见标签_files/Image [4].png" type="image/png" data-filename="Image.png"/></div><div><br/></div><h3><span style="font-size: 16pt; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">W3C是干嘛的？</span></h3><div><br/></div><div style="box-sizing: border-box; padding: 8px; font-family: Monaco, Menlo, Consolas, &quot;Courier New&quot;, monospace; font-size: 12px; color: rgb(51, 51, 51); border-radius: 4px; background-color: rgb(251, 250, 248); border: 1px solid rgba(0, 0, 0, 0.15);-en-codeblock:true;"><div><span style="font-size: 18pt;font-family: 微软雅黑;color: black;-en-paragraph:true;">W3C 万维网联盟</span></div><div><span style="font-size: 18pt;font-family: Arial;color: black;-en-paragraph:true;">World Wide Web Consortium</span></div></div><div><br/></div><div><img src="001-HTML入门及常见标签_files/Image [5].png" type="image/png" data-filename="Image.png" style="font-weight: bold; font-size: 16pt;"/></div><div><img src="001-HTML入门及常见标签_files/Image [6].png" type="image/png" data-filename="Image.png" style="font-weight: bold; font-size: 16pt;"/></div><h3 style="margin: 10px 0px; padding: 5px 0px 5px 15px; background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">HTML标准的发展历程</span></h3><div><br/></div><div><img src="file:///D:/2018%E6%A1%8C%E9%9D%A2/%E4%B8%80%E9%98%B6%E6%AE%B5%E8%AF%BE%E4%BB%B6/1%E3%80%81%E7%AC%AC%E4%B8%80%E5%A4%A9html%E5%9F%BA%E7%A1%80/%E7%AC%94%E8%AE%B01/images/pic03.png" style="font-weight: bold; font-size: 16pt;"></img><img src="001-HTML入门及常见标签_files/Image [7].png" type="image/png" data-filename="Image.png" style="font-weight: bold;"/></div><div><br/></div><h3 style="margin: 10px 0px; padding: 5px 0px 5px 15px; background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 20px; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">相关软件的应用以及站点的创建</span></h3><div><br/></div><div><br/></div><div><font style="font-size: 16pt;"><span style="font-size: 16pt; font-weight: bold;"><img src="001-HTML入门及常见标签_files/Image [8].png" type="image/png" data-filename="Image.png" width="670"/></span></font></div><div><br/></div><h3 style="margin: 10px 0px; padding: 5px 0px 5px 15px; background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">HTML基本结构和HTML语法</span></h3><div><br/></div><div><br/></div><div><img src="file:///D:/2018%E6%A1%8C%E9%9D%A2/%E4%B8%80%E9%98%B6%E6%AE%B5%E8%AF%BE%E4%BB%B6/1%E3%80%81%E7%AC%AC%E4%B8%80%E5%A4%A9html%E5%9F%BA%E7%A1%80/%E7%AC%94%E8%AE%B01/images/pic06.png"></img><img src="001-HTML入门及常见标签_files/Image [9].png" type="image/png" data-filename="Image.png"/></div><div><br/></div><div><br/></div><h3 style="margin: 10px 0px; padding: 5px 0px 5px 15px; background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="background: rgb(0, 170, 136); font-size: 20px; border-radius: 4px; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; color: rgb(255, 252, 244); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">HTML常用标记</span></h3><div><br/></div><div><br/></div><div><br/></div><div><span style="font-size: 12pt;">标签分为两种，单标签和双标签。</span></div><div><br/></div><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">1、文本标题（h1-h6）  </span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;h1&gt;LOGO&lt;/h1&gt; </span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;h2&gt;次要栏目或标题-小标题H2&lt;/h2&gt; </span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;h3&gt;再次要栏目或分类小标题H3&lt;/h3&gt; </span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;h4&gt;文中分类小标题H4&lt;/h4&gt; </span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;h5&gt;二级标题&lt;/h5&gt;</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;h6&gt;六级标题&lt;/h6&gt;</span></span></div><div style="margin: 0px; padding: 0px;"><font style="font-size: 12pt;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">html标题标签使用原则</span><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 40px;">：</span></font></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">H1在一个网页中最好只使用一次，如对一个网页LOGO使用。</span></div></blockquote><div style="margin: 15px 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">2、段落文本(p)  paragraph</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;p&gt;段落文本内容&lt;/p&gt;</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">标识一个段落(段落与段落之间有段间距)</span></span></div></blockquote><div style="margin: 15px 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">3、空格  </span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&amp;nbsp;</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">所占位置没有一个确定的值,这与当前字体字号都有关系.</span></span></div></blockquote><div style="margin: 15px 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">4、换行(br)</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;br /&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">换行是一个空标记(强制换行)</span></div></blockquote><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">5、加粗 加粗有两个标记</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">A、&lt;b&gt;加粗内容&lt;/b&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">B、&lt;strong&gt;加粗内容&lt;/strong&gt;</span></div></blockquote><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">6、倾斜</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;em&gt;&lt;/em&gt; ,&lt;i&gt;&lt;/i&gt;</span></div></blockquote><div style="margin: 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">7、水平线 horizontal line</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">   &lt;hr /&gt;空标记</span></div></blockquote><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">8、列表(ul,ol,dl)</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">HTML中有三种列表分别是：无序列表，有序列表，自定义列表</span></div><div style="margin: 0px; padding: 0px; overflow: hidden;"><div style="margin: 0px 30px 0px 0px; padding: 0px; float: left; height: 220px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">*无序列表</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">无序列表组成：</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;ul&gt;(unordered list)</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;li&gt;&lt;/li&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;li&gt;&lt;/li&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">．．．．．．</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;/ul&gt;</span></div></div><div style="margin: 0px 30px 0px 0px; padding: 0px; float: left; height: 220px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">*有序列表</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">有序列表组成：</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;ol&gt;(ordered list)</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;li&gt;&lt;/li&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;li&gt;&lt;/li&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">．．．．．．</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;/ol&gt;</span></div></div><div style="margin: 0px 30px 0px 0px; padding: 0px; float: left; height: 220px; overflow: hidden;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">*自定义列表</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;dl&gt;(definition list)</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;dt&gt;名词&lt;/dt&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;dd&gt;解释&lt;/dd&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">(definition description)</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">．．．．．．</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;/dl&gt;</span></div><div><br style="margin: 0px; padding: 0px;"/></div></div></div></blockquote><div><img src="001-HTML入门及常见标签_files/Image [10].png" type="image/png" data-filename="Image.png"/></div><div><img src="001-HTML入门及常见标签_files/Image [11].png" type="image/png" data-filename="Image.png"/></div><div><br/></div><div><br/></div><div><span style="font-size: 12pt; color: rgb(4, 77, 34); font-weight: bold;">知识扩展2----有序列表的属性</span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">1)、type:规定列表中的列表项目的项目符号的类型</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">语法：&lt;ol type=&quot;a&quot;&gt;&lt;/ol&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">1 数字顺序的有序列表（默认值）（1, 2, 3, 4）。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">a 字母顺序的有序列表，小写（a, b, c, d）。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">A 字母顺序的有序列表，大写（A,B,C,D)</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">i 罗马数字，小写（i, ii, iii, iv）。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">I 罗马数字，大写（I, ii, iii, iv）。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">2)、start 属性规定有序列表的开始点。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">语法：&lt;ol start=&quot;5&quot;&gt;&lt;/ol&gt;</span></div></blockquote><div style="margin: 15px 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">9、插入图片</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;img src=&quot;目标文件路径及全称&quot; alt=&quot;图片替换文本&quot; title=&quot;图片标题&quot; /&gt;</span></div><div><span style="font-size: 12pt; color: red; font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">注:所要插入的图片必须放在站点下</span></div><div><span style="font-size: 12pt; color: red; font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">title的作用:</span><span style="font-size: 12pt; color: red; font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;"> </span><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">在你鼠标悬停在该图片上时显示一个小提示，鼠标离开就没有了，HTML的绝大多数标签都支持title属性，title属性就是专门做提示信息的</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><font style="font-size: 12pt;"><span style="font-size: 12pt; color: red; font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;-en-paragraph:true;">alt的作用:</span><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;-en-paragraph:true;">alt属性是在你的图片因为某种原因不能加载时在页面显示的提示信息，它会直接输出在原本加载图片的地方。</span></font></div><div><span style="font-size: 12pt; color: red; font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">*相对路径的写法：</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">1)当当前文件与目标文件在同一目录下，直接书写目标文件文件名+扩展名；&lt;img src=”q12.jpg”/&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">2)当当前文件与目标文件所处的文件夹在同一目录下，写法如下：</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">文件夹名/目标文件全称+扩展名；&lt;img src=”images/q12.jpg”/&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">3)当当前文件所处的文件夹和目标文件所处的文件夹在同一目录下，写法如下：</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">../目标文件所处文件夹名/目标文件文件名+扩展名；</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;img src=”../images/q12.jpg”/&gt;</span></div></blockquote><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold;">10、超链接的应用</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">语法：</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;a href=&quot;目标文件路径及全称/连接地址&quot; title=&quot;提示文本&quot;&gt;链接文本/图片&lt;/a&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;a href=&quot;#&quot;&gt;&lt;/a&gt;空链接</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">属性：target:页面打开方式，默认属性值_self。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">属性值：</span><span style="font-size: 12pt; color: red; font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">_blank 新窗口打开</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;a href=&quot;#&quot; target=&quot;_blank&quot;&gt;新页面打开&lt;/a&gt;</span></div></blockquote><div style="margin: 15px 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">11、div和span的用法</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div style="margin: 0px; padding: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 40px;">&lt;div &gt;&lt;/div&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">没有具体含义，统称为块标签，</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">用来设置文档区域，是文档布局常用对象</span></span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;span&gt; &lt;/span&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">文本结点标签</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">可以是某一小段文本，或是某一个字。 </span></div></blockquote><div style="margin: 15px 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">12、数据表格的作用及组成</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">作用：显示数据</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">表格组成</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;table width=&quot;value&quot; height=&quot;value&quot; border=&quot;value&quot; bgcolor=&quot;value&quot; cellspacing=&quot;value&quot; cellpadding=&quot;value&quot;&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;tr&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;td&gt;&lt;/td&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;td&gt;&lt;/td&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;/tr&gt;</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;/table&gt;</span></span></div><div><span style="font-size: 12pt; color: red; font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">注：一个tr表示一行;一个td表示一列(一个单元格)</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">*数据表格的相关属性</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">1）width=&quot;表格的宽度&quot;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">2）height=&quot;表格的高度&quot;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">3）border=&quot;表格的边框&quot;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">4）bgcolor=&quot;表格的背景色&quot; bg=background</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">5）bordercolor=&quot;表格的边框颜色&quot;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">6）cellspacing=&quot;单元格与单元格之间的间距&quot;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">7）cellpadding=&quot;单元格与内容之间的空隙&quot;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">8）对齐方式：align=&quot;left/center/right&quot;;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">9)合并单元格属性：</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">colspan=“所要合并的单元格的列数&quot;合并列;</span></span></div><div style="margin: 0px; padding: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 40px;">rowspan=“所要合并单元格的行数”合并行;</span></div></blockquote><div style="margin: 15px 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">13、表单的作用及组成</span></span></div><div style="margin: 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; border-radius: 4px;"><span style="font-size: 12pt; color: red; font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 40px;">表单的作用：用来收集用户的信息的;</span></span></div><div><span style="font-size: 12pt;">1)、表单框</span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;form name=&quot;表单名称&quot; method=&quot;post/get&quot; action=&quot;&quot;&gt;&lt;/form&gt;</span></div></blockquote><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">2）文本框</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;input type=&quot;text&quot; value=&quot;默认值&quot;/&gt;</span></div></blockquote><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">3)密码框</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;input type=&quot;password&quot; /&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;input type=&quot;password&quot; placeholder=&quot;密码&quot; /&gt;</span></div></blockquote><div><span style="font-size: 12pt;">4)重置按钮</span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;input type=&quot;reset&quot; value=&quot;按钮内容&quot; /&gt;</span></div></blockquote><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">5）单选框/单选按钮</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;input type=&quot;radio&quot; name=&quot;ral&quot; /&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;input type=&quot;radio&quot; name=&quot;ral&quot; checked=&quot;checked&quot; /&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">单选按钮里的name属性必须写，同一组单选按钮的name属性值必须一样。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">checked=&quot;checked&quot;(默认选中；) disabled=&quot;disabled&quot;禁用</span></div></blockquote><div><span style="font-size: 12pt;">6）复选框</span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;input type=&quot;checkbox&quot; name=&quot;like&quot; /&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;input type=&quot;checkbox&quot; name=&quot;like&quot; disabled=&quot;disabled&quot; /&gt; (disabled=&quot;disabled&quot; :禁用)</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">(checked=&quot;checked&quot; :默认选中)</span></div></blockquote><div><span style="font-size: 12pt;">7)下拉菜单</span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;select name=&quot;&quot;&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;option&gt;菜单内容&lt;/option&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;/select&gt;</span></div></blockquote><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">8）多行文本框（文本域）</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;textarea name=&quot;textareal&quot; cols=&quot;字符宽度&quot; rows=&quot;行数&quot;&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;/textarea&gt;</span></div></blockquote><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">9)按钮</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;input name=&quot;'&quot; type=&quot;button&quot; value=“按钮内容” /&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;input name=&quot;'&quot; type=&quot;submit&quot; value=“按钮内容” /&gt;</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">&lt;button&gt;&lt;/button&gt;</span></div></blockquote><div><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: red; font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 40px;">button和submit的区别是：</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">submit是提交按钮起到提交信息的作用，type类型是button只起到跳转的作用，不进行提交。</span></div></blockquote><div style="margin: 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(4, 77, 34); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">扩展知识点3：对于不同的输入类型，value 属性的用法的意义</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">value 属性为 input 元素设定值。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">对于不同的输入类型，value 属性的用法也不同：</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">type=&quot;button&quot;, &quot;reset&quot;, &quot;submit&quot; - 定义按钮上的显示的文本</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">type=&quot;text&quot;, &quot;password&quot; - 定义输入字段的初始值</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">type=&quot;checkbox&quot;, &quot;radio&quot; - 定义与输入相关联的值</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">注释：&lt;input type=&quot;checkbox&quot;&gt; 和 &lt;input type=&quot;radio&quot;&gt; 中必须设置 value 属性。</span></div></blockquote><div style="margin: 0px; padding: 0px; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><span style="font-size: 12pt; color: rgb(4, 77, 34); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: bold; line-height: 40px;">扩展知识点4：</span></span></div><blockquote style="margin: 10px 0px; padding: 10px; border-width: 1px 1px 1px 6px; border-style: solid; border-radius: 4px; border-color: rgb(255, 102, 0); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;"><div style="margin: 0px; padding: 0px;"><span style="font-size: 12pt; color: rgb(4, 77, 34); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 40px;">&lt;form name=&quot;表单名称&quot; method=&quot;post/get&quot; action=&quot;&quot;&gt;&lt;/form&gt;</span></div><div style="margin: 0px; padding: 0px;"><span style="font-size: 12pt; color: rgb(4, 77, 34); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 40px;">Form中的获取数据的两个方式get和post的区别？</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">1. get是从服务器上获取数据，post是向服务器传送数据。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">2. get是把参数数据队列加到提交表单的ACTION属性所指的URL中，值和表单内各个字段一一对应，在URL中可以看到。post是通过HTTP post机制，将表单内各个字段与其内容放置在HTML HEADER内一起传送到ACTION属性所指的URL地址。用户看不到这个过程。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">3. 对于get方式，服务器端用Request.QueryString获取变量的值，对于post方式，服务器端用Request.Form获取提交的数据。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">4. get传送的数据量较小，不能大于2KB。post传送的数据量较大，一般被默认为不受限制。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">5. get安全性非常低，post安全性较高。但是执行效率却比Post方法好。</span></div><div><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">建议：</span></div><div style="margin-top: 1em; margin-bottom: 1em;"><span style="-en-paragraph:true;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal;">1、get方式的安全性较Post方式要差些，包含机密信息的话，建议用Post数据提交方式；</span></span></div><div style="margin: 0px; padding: 0px;"><span style="font-size: 12pt; color: rgb(0, 0, 0); font-family: 微软雅黑; font-variant-caps: normal; font-variant-ligatures: normal; line-height: 40px;">2、在做数据查询时，建议用Get方式；而在做数据添加、修改或删除时，建议用Post方式；</span></div></blockquote></div><div><br/></div></span>
</div></body></html> 